<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>销售员管理</title>
<!-- 导入jquery核心类库 -->
<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/jquery-1.8.3.js"></script>
	
	<script type="text/javascript"
	src="${pageContext.request.contextPath }/js/echarts.js"></script>
	
	<script type="text/javascript">
	
$(function(){
	 var myChart = echarts.init(document.getElementById('main'));

     // 指定图表的配置项和数据
     var option = {
         title: {
             text: '销售员出库数量统计'
         },
			 toolbox: {
				feature: {
					saveAsImage: {}
				}
			},
         tooltip: {},
         legend: {
             data:['销量']
         },
         xAxis: {
             //data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
             data: []
         },
         yAxis: {},
         series: [{
             name: '销量',
             type: 'bar',
            // data: [5, 20, 36, 10, 10, 20]
            data: []
         }]
     };

     // 使用刚指定的配置项和数据显示图表。
     myChart.setOption(option);
     
	$.get('${pageContext.request.contextPath}/page.rulerseller.ashx').done(function (data) {
		
	    // 填入数据
	    myChart.setOption({
	    	xAxis: {
	             data: data.name
	         },
	    	
	        series: [{
	            // 根据名字对应到相应的系列
	            name: '销量',
	            data: data.data
	        }]
	    });
	}); 
		
		if (option && typeof option === "object") {
			myChart.setOption(option, true);
		}
	
	
	
})


	</script>

</head>
<body>
	 <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
    <div id="main" style="width: 1100px;height:450px;"></div>
</body>
</html>